/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Sep 9, 2014, 5:22:35 PM
    Author     : HOME
*/

#arcade_game a {
    display: block;
    position: relative;
    width: 300px;
    font-size: 40px;
    margin: 0 auto;
    text-decoration: none;
    text-transform: uppercase;
    line-height: 100px;
    padding: 10px 0px 10px 120px;
    color: rgb(123, 26, 55);
    font-family: fantasy;
}
#arcade_game a:before,
#arcade_game a:after {
    content:"";
    display: block;
    position: absolute;
    left: 0px;
    top: 50%;
}
#arcade_game a:before {
    width: 70px;

    height: 70px;
    background: red;
    border-radius: 35px;
    line-height: 70px;
    z-index: 2;
    margin-top: -35px;
    left: 15px;
}
#arcade_game a:after {
    z-index: 1;
    width: 100px;
    height: 100px;
    margin-top: -50px;
    border-radius: 50px;
    background: green;
}
#arcade_game a:active:before {
    background: white;
}
.i-talic {
    display: table-cell;
    width: 100px;
    height: 50px;
    margin: 0 auto;
    text-transform: uppercase;
    font-style: normal;
    vertical-align: middle;
    text-align: center;
    background: green;
    color: #fff;
    font-size: 20px;    
    -webkit-animation: change 5s infinite; /* Chrome, Safari, Opera */ 
    animation: change 5s infinite;
}
@keyframes change{
    0%{background: green; transition: all 1s;}
    100%{background: red; font-size: 15px; transition: background 1s;}
}
@-webkit-keyframes change{
    0%{background: green; transition: all 1s;}
    100%{background: red; font-size: 15px; transition: all 1s;}
}